<!DOCTYPE html>
<html lang="en" dir=ZgotmplZ>

<head>
  <script async defer src="https://buttons.github.io/buttons.js"></script>
  <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="interface component to handle custom methods">
<meta name="theme-color" content="#FFFFFF"><meta property="og:title" content="furo-custom-method" />
<meta property="og:description" content="interface component to handle custom methods" />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://web-components.furo.pro/docs/modules/furo-data/furo-custom-method/" /><meta property="article:section" content="docs" />

<meta property="article:modified_time" content="2023-05-15T11:08:04+02:00" />
<title>furo-custom-method | フロー Furo Web</title>
<link rel="manifest" href="/manifest.json">
<link rel="icon" href="/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/book.min.9cf05710651e8f9a974123fc1a656fbb5eb2f912dba4c022b69792d2f93e1c40.css" integrity="sha256-nPBXEGUej5qXQSP8GmVvu16y&#43;RLbpMAitpeS0vk&#43;HEA=">
<script defer src="/en.search.min.b0bf84841deec51ff6f5057e68d3262d4265b55605be890ebf7c38b97b2fe329.js" integrity="sha256-sL&#43;EhB3uxR/29QV&#43;aNMmLUJltVYFvokOv3w4uXsv4yk="></script>
<!--
Made with Book Theme
https://github.com/alex-shpak/hugo-book
-->

  

  <link href="/main.css" rel="stylesheet"/>
</head>

<body dir=ZgotmplZ>
<fixed-tooltip-display></fixed-tooltip-display>
  <input type="checkbox" class="hidden toggle" id="menu-control" />
  <input type="checkbox" class="hidden toggle" id="toc-control" />
  <div ></div>
  <main class="container flex">
    <aside class="book-menu">
      
  <nav>
<h2 class="book-brand">
  <a href="/"><span>フロー Furo Web</span>
  </a>
</h2>


<div class="book-search">
  <input type="text" id="book-search-input" placeholder="Search" aria-label="Search" maxlength="64" data-hotkeys="s/" />
  <div class="book-search-spinner hidden"></div>
  <ul id="book-search-results"></ul>
</div>











  



  
  <ul>
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-64d0ac0e8a385a6091d238dd382da7cf" class="toggle"  />
    <label for="section-64d0ac0e8a385a6091d238dd382da7cf" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/guides/" class="">Guides</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/guides/dealing-w-data/" class="">Dealing with data</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-48dba13e1258b1e2cf129032b0d1fc3e" class="toggle"  />
    <label for="section-48dba13e1258b1e2cf129032b0d1fc3e" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/guides/routing/" class="">Routing</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/guides/routing/subrouting/" class="">Sub routing</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/guides/app-flow/" class="">Application Flow</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/guides/FNA/" class="">Extending a UI lib</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/guides/type-renderer/" class="">Type Renderer</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/guides/featuretoggle/" class="">Feature Toggles</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-c131070b1e715f28624af5fdfd93165a" class="toggle" checked />
    <label for="section-c131070b1e715f28624af5fdfd93165a" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/" class="">Packages</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-cca842a4d0376120bfbf8e2c08c07ff4" class="toggle" checked />
    <label for="section-cca842a4d0376120bfbf8e2c08c07ff4" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/furo-data/" class="">@furo/data</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-api-fetch/" class="">furo-api-fetch</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-collection-agent/" class="">furo-collection-agent</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-custom-method/" class=" active">furo-custom-method</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-data-flow-repeat/" class="">furo-data-flow-repeat</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-data-hide-content/" class="">furo-data-hide-content</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-data-object/" class="">furo-data-object</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-deep-link/" class="">furo-deep-link</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-entity-agent/" class="">furo-entity-agent</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-entity-field/" class="">furo-entity-field</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-hateoas-state/" class="">furo-hateoas-state</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-message-container-handler/" class="">furo-message-container-handler</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-rel-exists/" class="">furo-rel-exists</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-reverse-deep-link/" class="">furo-reverse-deep-link</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/furo-type-renderer/" class="">furo-type-renderer</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/AgentHelper/" class="">AgentHelper</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/DataObject/" class="">DataObject</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/FieldNode/" class="">FieldNode</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/FieldNodeAdapter/" class="">FieldNodeAdapter</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/RepeaterNode/" class="">RepeaterNode</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ScalarTypeHelper/" class="">ScalarTypeHelper</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorDefaultTypes/" class="">ValidatorDefaultTypes</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorFuroBigDecimal/" class="">ValidatorFuroBigDecimal</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorFuroReference/" class="">ValidatorFuroReference</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorGoogleProtobufBoolValue/" class="">ValidatorGoogleProtobufBoolValue</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorGoogleProtobufFloatValue/" class="">ValidatorGoogleProtobufFloatValue</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorGoogleProtobufInt64Value/" class="">ValidatorGoogleProtobufInt64Value</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorGoogleTypeDate/" class="">ValidatorGoogleTypeDate</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorGoogleTypeMoney/" class="">ValidatorGoogleTypeMoney</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-data/ValidatorNumericTypes/" class="">ValidatorNumericTypes</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-021db3e6cecc4cb464638d9452766952" class="toggle"  />
    <label for="section-021db3e6cecc4cb464638d9452766952" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/furo-fbp/" class="">@furo/fbp</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-fbp/empty-fbp-node/" class="">empty-fbp-node</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-fbp/flow-bind/" class="">flow-bind</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-fbp/flow-repeat/" class="">flow-repeat</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-fbp/DOMFBP/" class="">DOMFBP</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-fbp/FBP/" class="">FBP</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-fbp/FbpBreakpoints/" class="">FbpBreakpoints</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-3e40020dcb75400959dcadfc7e247453" class="toggle"  />
    <label for="section-3e40020dcb75400959dcadfc7e247453" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/furo-framework/" class="">@furo/framework</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/BaseSpecValidators/" class="">BaseSpecValidators</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/Env/" class="">Env</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/FuroFeatureToggle/" class="">FuroFeatureToggle</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/i18n/" class="">i18n</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/Init/" class="">Init</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/KeyState/" class="">KeyState</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/NodeEvent/" class="">NodeEvent</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorFuroBigDecimal/" class="">ValidatorFuroBigDecimal</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorFuroFatNumeric/" class="">ValidatorFuroFatNumeric</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorFuroFatString/" class="">ValidatorFuroFatString</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorFuroReference/" class="">ValidatorFuroReference</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorGoogleProtobufBoolValue/" class="">ValidatorGoogleProtobufBoolValue</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorGoogleProtobufFloatValue/" class="">ValidatorGoogleProtobufFloatValue</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorGoogleProtobufInt64Value/" class="">ValidatorGoogleProtobufInt64Value</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorGoogleProtobufTimestamp/" class="">ValidatorGoogleProtobufTimestamp</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorGoogleTypeDate/" class="">ValidatorGoogleTypeDate</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorGoogleTypeMoney/" class="">ValidatorGoogleTypeMoney</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-framework/ValidatorRegistry/" class="">ValidatorRegistry</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-71921f8b00ba9f1d7ea65557f9a4892b" class="toggle"  />
    <label for="section-71921f8b00ba9f1d7ea65557f9a4892b" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/furo-layout/" class="">@furo/layout</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-backdrop/" class="">furo-backdrop</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-backdrop-display/" class="">furo-backdrop-display</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-empty-spacer/" class="">furo-empty-spacer</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-form-layouter/" class="">furo-form-layouter</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-horizontal-flex/" class="">furo-horizontal-flex</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-resizer/" class="">furo-resizer</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-split-view/" class="">furo-split-view</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-vertical-flex/" class="">furo-vertical-flex</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-layout/furo-vertical-scroller/" class="">furo-vertical-scroller</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-d417ac8cb7a1ccb4381e8ddf1c7562a0" class="toggle"  />
    <label for="section-d417ac8cb7a1ccb4381e8ddf1c7562a0" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/furo-route/" class="">@furo/route</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-app-flow/" class="">furo-app-flow</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-app-flow-router/" class="">furo-app-flow-router</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-document-title/" class="">furo-document-title</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-location/" class="">furo-location</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-location-updater/" class="">furo-location-updater</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-lock-navigation/" class="">furo-lock-navigation</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-pages/" class="">furo-pages</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/furo-panel-coordinator/" class="">furo-panel-coordinator</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/BasePanel/" class="">BasePanel</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-route/panelRegistry/" class="">panelRegistry</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-97a0e3b8ee9f906213df62a54586924e" class="toggle"  />
    <label for="section-97a0e3b8ee9f906213df62a54586924e" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/furo-util/" class="">@furo/util</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-config/" class="">furo-config</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-config-loader/" class="">furo-config-loader</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-de-bounce/" class="">furo-de-bounce</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-demo-snippet/" class="">furo-demo-snippet</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-feature-toggle/" class="">furo-feature-toggle</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-fetch-json/" class="">furo-fetch-json</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-forth-stack/" class="">furo-forth-stack</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-get-clipboard/" class="">furo-get-clipboard</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-graph-renderer/" class="">furo-graph-renderer</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-head-tail/" class="">furo-head-tail</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-hp-35/" class="">furo-hp-35</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-interval-pulse/" class="">furo-interval-pulse</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-key-filter/" class="">furo-key-filter</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-keydown/" class="">furo-keydown</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-markdown/" class="">furo-markdown</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-navigation-pad/" class="">furo-navigation-pad</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-pretty-json/" class="">furo-pretty-json</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-put-clipboard/" class="">furo-put-clipboard</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/furo-show-flow/" class="">furo-show-flow</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/light-bulb/" class="">light-bulb</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/Config/" class="">Config</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/ConfigTree/" class="">ConfigTree</a>
  

        </li>
      
    
      
        <li>
          
  
  

  
    <a href="https://web-components.furo.pro/docs/modules/furo-util/EmptyStackError/" class="">EmptyStackError</a>
  

        </li>
      
    
  </ul>

        </li>
      
    
      
        <li>
          
  
  

  
    <input type="checkbox" id="section-e8b2e199854a11484105b91a892831fe" class="toggle"  />
    <label for="section-e8b2e199854a11484105b91a892831fe" class="flex justify-between">
      <a href="https://web-components.furo.pro/docs/modules/furo-webtypes/" class="">@furo/web-types</a>
      <span>▾</span>
    </label>
  

          
  <ul>
    
  </ul>

        </li>
      
    
  </ul>

        </li>
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
      
    
  </ul>











  
<ul>
  
  <li>
    <a href="https://ui5.furo.pro" target="_blank" rel="noopener">
        SAP UI5 Integration
      </a>
  </li>
  
  <li>
    <a href="https://furo.pro" target="_blank" rel="noopener">
        フロー Furo
      </a>
  </li>
  
</ul>






</nav>




  <script>(function(){var e=document.querySelector("aside.book-menu nav");addEventListener("beforeunload",function(){localStorage.setItem("menu.scrollTop",e.scrollTop)}),e.scrollTop=localStorage.getItem("menu.scrollTop")})()</script>


 
    </aside>

    <div class="book-page">
      <header class="book-header">
        
  <div class="flex align-center justify-between">
  <label for="menu-control">
    <img src="/svg/menu.svg" class="book-icon" alt="Menu" />
  </label>

  <strong>furo-custom-method</strong>

  <label for="toc-control">
    
    <img src="/svg/toc.svg" class="book-icon" alt="Table of Contents" />
    
  </label>
</div>


  
  <aside class="hidden clearfix">
    
  <nav id="TableOfContents">
  <ul>
    <li><a href="#attributes-and-properties">Attributes and Properties</a>
      <ul>
        <li><a href="#service"><strong>service</strong></a></li>
        <li><a href="#method"><strong>method</strong></a></li>
      </ul>
    </li>
    <li><a href="#events">Events</a>
      <ul>
        <li><a href="#hts-updated"><strong>hts-updated</strong></a></li>
        <li><a href="#request-aborted"><strong>request-aborted</strong></a></li>
        <li><a href="#request-started"><strong>request-started</strong></a></li>
        <li><a href="#response-raw"><strong>response-raw</strong></a></li>
        <li><a href="#response-error"><strong>response-error</strong></a></li>
        <li><a href="#response-error-status-code"><strong>response-error-[status-code]</strong></a></li>
        <li><a href="#fatal-error"><strong>fatal-error</strong></a></li>
        <li><a href="#response-error-4xx"><strong>response-error-4xx</strong></a></li>
        <li><a href="#response-error-5xx"><strong>response-error-5xx</strong></a></li>
        <li><a href="#response-error-raw"><strong>response-error-raw</strong></a></li>
        <li><a href="#response"><strong>response</strong></a></li>
      </ul>
    </li>
    <li><a href="#methods">Methods</a>
      <ul>
        <li><a href="#updateqp"><strong>updateQp</strong></a></li>
        <li><a href="#bindrequestdata"><strong>bindRequestData</strong></a></li>
        <li><a href="#clearqp"><strong>clearQp</strong></a></li>
        <li><a href="#trigger"><strong>trigger</strong></a></li>
        <li><a href="#triggerempty"><strong>triggerEmpty</strong></a></li>
        <li><a href="#triggerwithbody"><strong>triggerWithBody</strong></a></li>
        <li><a href="#htsin"><strong>htsIn</strong></a></li>
        <li><a href="#abortpendingrequest"><strong>abortPendingRequest</strong></a></li>
      </ul>
    </li>
  </ul>
</nav>


  </aside>
  
 
      </header>

      
      
  <article class="markdown"><h1 id="furo-custom-method">
  furo-custom-method
  <a class="anchor" href="#furo-custom-method">#</a>
</h1>
<p><strong>@furo/data</strong> <small>v2.18.0</small>
<br><code>import '@furo/data/src/furo-custom-method.js';</code><small>
<br>exports <em>FuroCustomMethod</em> js
<br>exports <code>&lt;furo-custom-method&gt;</code> custom-element-definition
<br>superclass <em>LitElement</em>
<br> mixes <em>FBP</em></small>
<br><small>summary <em>interface component to handle custom methods</em></small></p>
<p><code>furo-custom-method</code> is a interface component to handle custom methods.</p>
<div class="highlight"><div style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4;">
<table style="border-spacing:0;padding:0;margin:0;border:0;"><tr><td style="vertical-align:top;padding:0;margin:0;border:0;">
<pre tabindex="0" style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">1
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">2
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">3
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">4
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">5
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">6
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">7
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">8
</span><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f">9
</span></code></pre></td>
<td style="vertical-align:top;padding:0;margin:0;border:0;;width:100%">
<pre tabindex="0" style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-html" data-lang="html"><span style="display:flex;"><span>&lt;<span style="color:#000080">furo-custom-method</span>
</span></span><span style="display:flex;"><span>    <span style="color:#008080">service</span><span style="color:#000;font-weight:bold">=</span><span style="color:#d14">&#34;Servicename&#34;</span>
</span></span><span style="display:flex;"><span>    <span style="color:#008080">method</span><span style="color:#000;font-weight:bold">=</span><span style="color:#d14">&#34;release&#34;</span>
</span></span><span style="display:flex;"><span>    <span style="color:#008080">fn-hts-in</span><span style="color:#000;font-weight:bold">=</span><span style="color:#d14">&#34;--hts&#34;</span>
</span></span><span style="display:flex;"><span>    <span style="color:#008080">fn-trigger</span><span style="color:#000;font-weight:bold">=</span><span style="color:#d14">&#34;--customClick&#34;</span>&gt;&lt;/<span style="color:#000080">furo-custom-method</span>&gt;
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span><span style="color:#998;font-style:italic">&lt;!-- produces a hateoas link array --&gt;</span>
</span></span><span style="display:flex;"><span>&lt;<span style="color:#000080">furo-deep-link</span>
</span></span><span style="display:flex;"><span>    <span style="color:#008080">service</span><span style="color:#000;font-weight:bold">=</span><span style="color:#d14">&#34;Servicename&#34;</span> <span style="color:#008080">at-hts-out</span><span style="color:#000;font-weight:bold">=</span><span style="color:#d14">&#34;--hts&#34;</span>&gt;&lt;/<span style="color:#000080">furo-deep-link</span>&gt;
</span></span></code></pre></td></tr></table>
</div>
</div><ul>
<li><em>before you can do any requests, the service, method and the HATEOAS must be known</em></li>
</ul>
<h2 id="attributes-and-properties">
  Attributes and Properties
  <a class="anchor" href="#attributes-and-properties">#</a>
</h2>
<h3 id="service">
  <strong>service</strong>
  <a class="anchor" href="#service">#</a>
</h3>
<p><span  style="border-width:2px; border-style: solid;border-color:  rgb(255, 182, 91);font-family:monospace; padding:2px 4px;">service</span>
<small><code>String</code> </small></p>
<p>Setze den Service
<br><br></p>
<h3 id="method">
  <strong>method</strong>
  <a class="anchor" href="#method">#</a>
</h3>
<p><span  style="border-width:2px; border-style: solid;border-color:  rgb(255, 182, 91);font-family:monospace; padding:2px 4px;">method</span>
<small><code>String</code> </small></p>
<p>Name of the custom method / rel.
<br><br></p>
<h2 id="events">
  Events
  <a class="anchor" href="#events">#</a>
</h2>
<h3 id="hts-updated">
  <strong>hts-updated</strong>
  <a class="anchor" href="#hts-updated">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-hts-updated</span>
→ <small><code>HTS</code></small></p>
<p>Fired when hts was updated by <code>fn-hts-in</code>.
<br><br></p>
<h3 id="request-aborted">
  <strong>request-aborted</strong>
  <a class="anchor" href="#request-aborted">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-request-aborted</span>
→ <small><code>Request</code></small></p>
<p>Fired when a request was canceled.
<br><br></p>
<h3 id="request-started">
  <strong>request-started</strong>
  <a class="anchor" href="#request-started">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-request-started</span>
→ <small><code>Request</code></small></p>
<p>Fired when a request is sent.
<br><br></p>
<h3 id="response-raw">
  <strong>response-raw</strong>
  <a class="anchor" href="#response-raw">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-response-raw</span>
→ <small><code>Object</code></small></p>
<p>Fired when a response is received.
<br><br></p>
<h3 id="response-error">
  <strong>response-error</strong>
  <a class="anchor" href="#response-error">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-response-error</span>
→ <small><code>Object</code></small></p>
<p>Fired when an error has occoured. This is a general error event. The specific error events are fired additionally.
<br><br></p>
<h3 id="response-error-status-code">
  <strong>response-error-[status-code]</strong>
  <a class="anchor" href="#response-error-status-code">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-response-error-[status-code]</span>
→ <small><code>Object</code></small></p>
<p>Fired when an error has occoured. This is a specific error event.
<br><br></p>
<h3 id="fatal-error">
  <strong>fatal-error</strong>
  <a class="anchor" href="#fatal-error">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-fatal-error</span>
→ <small><code>Request</code></small></p>
<p>Requests are made via the Fetch API if possible.Fallback XMLHttpRequest
<br><br></p>
<h3 id="response-error-4xx">
  <strong>response-error-4xx</strong>
  <a class="anchor" href="#response-error-4xx">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-response-error-4xx</span>
→ <small><code>Object</code></small></p>
<p>Fired when an error has occoured. This is a group error event. E.g. response-error-5xx, response-error-4xx
<br><br></p>
<h3 id="response-error-5xx">
  <strong>response-error-5xx</strong>
  <a class="anchor" href="#response-error-5xx">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-response-error-5xx</span>
→ <small><code>Object</code></small></p>
<p>Fired when an error has occoured. This is a group error event. E.g. response-error-5xx, response-error-4xx
<br><br></p>
<h3 id="response-error-raw">
  <strong>response-error-raw</strong>
  <a class="anchor" href="#response-error-raw">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-response-error-raw</span>
→ <small><code>Object</code></small></p>
<p>Fired when a error has occoured.
<br><br></p>
<h3 id="response">
  <strong>response</strong>
  <a class="anchor" href="#response">#</a>
</h3>
<p><span  style="border-width:2px 10px 2px 2px; border-style: solid;border-color:  rgb(2, 168, 244);font-family:monospace; padding:2px 4px;">at-response</span>
→ <small><code>Object</code></small></p>
<p>Fired when a response is received.
<br><br></p>
<h2 id="methods">
  Methods
  <a class="anchor" href="#methods">#</a>
</h2>
<h3 id="updateqp">
  <strong>updateQp</strong>
  <a class="anchor" href="#updateqp">#</a>
</h3>
<p><small><strong>updateQp</strong>(<em>qp</em> `` <em>key</em> <code>Object</code> ) ⟹ <code>void</code></small></p>
<p><small>`` <code>Object</code> </small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-update-qp</span></p>
<p>Update query params
a qp like {&ldquo;active&rdquo;:true} will just update the qp <em>active</em></p>
<p>If the current value of the qp is not the same like the injected value, a qp-changed event will be fired</p>
<ul>
<li><small><em>qp</em> </small></li>
<li><small><em>key</em> value pairs</small>
<br><br></li>
</ul>
<h3 id="bindrequestdata">
  <strong>bindRequestData</strong>
  <a class="anchor" href="#bindrequestdata">#</a>
</h3>
<p><small><strong>bindRequestData</strong>(<em>dataObject</em> `` ) ⟹ <code>void</code></small></p>
<p><small>`` </small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-bind-request-data</span></p>
<p>Binds a furo-data-object type.</p>
<ul>
<li><small><em>dataObject</em> </small>
<br><br></li>
</ul>
<h3 id="clearqp">
  <strong>clearQp</strong>
  <a class="anchor" href="#clearqp">#</a>
</h3>
<p><small><strong>clearQp</strong>() ⟹ <code>void</code></small></p>
<p><small><code>*</code></small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-clear-qp</span></p>
<p>clear the query params that you have setted before</p>
<p><br><br></p>
<h3 id="trigger">
  <strong>trigger</strong>
  <a class="anchor" href="#trigger">#</a>
</h3>
<p><small><strong>trigger</strong>() ⟹ <code>void</code></small></p>
<p><small><code>*</code></small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-trigger</span></p>
<p>trigger the method with respect for binded-requset-object</p>
<p><br><br></p>
<h3 id="triggerempty">
  <strong>triggerEmpty</strong>
  <a class="anchor" href="#triggerempty">#</a>
</h3>
<p><small><strong>triggerEmpty</strong>() ⟹ <code>void</code></small></p>
<p><small><code>*</code></small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-trigger-empty</span></p>
<p><br><br></p>
<h3 id="triggerwithbody">
  <strong>triggerWithBody</strong>
  <a class="anchor" href="#triggerwithbody">#</a>
</h3>
<p><small><strong>triggerWithBody</strong>(<em>body</em> `` ) ⟹ <code>void</code></small></p>
<p><small>`` </small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-trigger-with-body</span></p>
<p>trigger the method with data</p>
<ul>
<li><small><em>body</em> </small>
<br><br></li>
</ul>
<h3 id="htsin">
  <strong>htsIn</strong>
  <a class="anchor" href="#htsin">#</a>
</h3>
<p><small><strong>htsIn</strong>(<em>hts</em> `` ) ⟹ <code>void</code></small></p>
<p><small>`` </small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-hts-in</span></p>
<ul>
<li><small><em>hts</em> </small>
<br><br></li>
</ul>
<h3 id="abortpendingrequest">
  <strong>abortPendingRequest</strong>
  <a class="anchor" href="#abortpendingrequest">#</a>
</h3>
<p><small><strong>abortPendingRequest</strong>() ⟹ <code>void</code></small></p>
<p><small><code>*</code></small> →
<span  style="border-width:2px 2px 2px 10px; border-style: solid;border-color:  rgb(76, 175, 80);font-family:monospace; padding:2px 4px;">fn-abort-pending-request</span></p>
<p>Aborts a pending request</p>
<p><br><br></p>
</article>
 
      

      <footer class="book-footer">
        
  <div class="flex flex-wrap justify-between">



  <div><a class="flex align-center" href="https://github.com/theNorstroem/furo/documentation/commit/98f19d453453c76144147e187904f3bdac5a588f" title='Last modified by veith | May 15, 2023' target="_blank" rel="noopener">
      <img src="/svg/calendar.svg" class="book-icon" alt="Calendar" />
      <span>May 15, 2023</span>
    </a>
  </div>



</div>

 
        
      </footer>

      
  
  <div class="book-comments">

</div>
  
 

      <label for="menu-control" class="hidden book-menu-overlay"></label>
    </div>

    
    <aside class="book-toc">
      
  <nav id="TableOfContents">
  <ul>
    <li><a href="#attributes-and-properties">Attributes and Properties</a>
      <ul>
        <li><a href="#service"><strong>service</strong></a></li>
        <li><a href="#method"><strong>method</strong></a></li>
      </ul>
    </li>
    <li><a href="#events">Events</a>
      <ul>
        <li><a href="#hts-updated"><strong>hts-updated</strong></a></li>
        <li><a href="#request-aborted"><strong>request-aborted</strong></a></li>
        <li><a href="#request-started"><strong>request-started</strong></a></li>
        <li><a href="#response-raw"><strong>response-raw</strong></a></li>
        <li><a href="#response-error"><strong>response-error</strong></a></li>
        <li><a href="#response-error-status-code"><strong>response-error-[status-code]</strong></a></li>
        <li><a href="#fatal-error"><strong>fatal-error</strong></a></li>
        <li><a href="#response-error-4xx"><strong>response-error-4xx</strong></a></li>
        <li><a href="#response-error-5xx"><strong>response-error-5xx</strong></a></li>
        <li><a href="#response-error-raw"><strong>response-error-raw</strong></a></li>
        <li><a href="#response"><strong>response</strong></a></li>
      </ul>
    </li>
    <li><a href="#methods">Methods</a>
      <ul>
        <li><a href="#updateqp"><strong>updateQp</strong></a></li>
        <li><a href="#bindrequestdata"><strong>bindRequestData</strong></a></li>
        <li><a href="#clearqp"><strong>clearQp</strong></a></li>
        <li><a href="#trigger"><strong>trigger</strong></a></li>
        <li><a href="#triggerempty"><strong>triggerEmpty</strong></a></li>
        <li><a href="#triggerwithbody"><strong>triggerWithBody</strong></a></li>
        <li><a href="#htsin"><strong>htsIn</strong></a></li>
        <li><a href="#abortpendingrequest"><strong>abortPendingRequest</strong></a></li>
      </ul>
    </li>
  </ul>
</nav>

 
    </aside>
    
  </main>

  
</body>


<script type="module" src="https://cdn.jsdelivr.net/npm/@furo/precompiled@2.6.0/dist/doc-helper.js"></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/@furo/precompiled@2.6.0/dist/furo-fbp.js"></script>
</html>












